<template>
  <div id="app">
    <div id="nav">
      <router-link 
        active-class="active" 
        to="/movie"
        custom
        v-slot="{navigate}"
      >
        <span @click="navigate">电影</span>
      </router-link> | 
      <router-link 
        active-class="active" 
        to="/tv"
        custom
        v-slot="{navigate, route}"
      >
        <span @click="navigate">电视剧</span>
      </router-link> | 
      <router-link 
        active-class="active" 
        to="/env/12"
        custom
        v-slot="{navigate}"
      >
        <span @click="navigate">综艺</span>
      </router-link>
    </div>
    <router-view></router-view>
    <router-view name="about"></router-view>
  </div>
</template>

<style lang="stylus">
#app
  font-family Avenir, Helvetica, Arial, sans-serif
  -webkit-font-smoothing antialiased
  -moz-osx-font-smoothing grayscale
  color #2c3e50
  margin-top 60px

span.active
  color red
</style>
